<template>
    <el-card id="card" >
      <img class="imgae" :src="imgurl">
      <div class="username">{{ username }}</div>
    </el-card>
  </template>
  
  <script>
  export default {
    props: {
      imgurl: {
        type: String,
        required: true,
      },
      username: {
        type: String,
        required: true,
      },
    },
  };
  </script>
  
  <style scoped>
  #card {
    width: 200px;
    /* width: auto; */
    margin-top:10px;
    margin-right: 10px;
    display: flex;
    flex-direction: column; /* 将子元素垂直排列 */
    align-items: center; /* 在交叉轴上居中对齐，即水平居中 */
    justify-content: center; /* 在主轴上居中对齐，即垂直居中 */
  }
  .imgae{
    width:176px;
    height:176px;
    border-radius: 50%;
  }
  .username {
    margin-top: 10px; /* 可以根据需要调整距离 */
    text-align: center; /* 文字居中 */
  }
  .dialog{
      min-height: 1000px !important;
  }
  </style>
  